<html>
<head>
<SCRIPT LANGUAGE="Javascript">
function checkFields() {
    var theForm = document.confirm;
    var memberList = "List: ";
    for (var i = 0; i < theForm.member.length; i++) {
        if (theForm.member[i].checked == true) {
            memberList += theForm.member[i].value;
        }
    }
    
    alert(memberList);

	return true;
}

function saveChanges() {
	if (checkFields()) {
	    document.confirm.action = "<%=servletDir%>/UserGrpUpdateAction";
	    //document.confirm.submit();
		alert("form submit.");
	}
}

function onChangeCategory() {
    alert("you select sth");
}

</SCRIPT>
</head>

<body>
<FORM METHOD="POST" NAME="confirm">
<INPUT TYPE="hidden" NAME="GROUP_ID" VALUE="1">
<DIV>
<TABLE ALIGN="center" BGCOLOR="#336633" BORDER="0" CELLPADDING="1" CELLSPACING="0" WIDTH="98%">
  <TR><TD class="bg_darkgreen">
	<TABLE ALIGN="center" BGCOLOR="#336633" BORDER="0" CELLPADDING="0" CELLSPACING="5" WIDTH="100%">
	<TR><TD class="bg_darkgreen">
	  <p class="white"><b>&nbsp;Edit User Group Profile</b></p>
	</TD></TR>
	</TABLE>

    <TABLE ALIGN="center" BGCOLOR="#f6f6f6" BORDER="0" CELLPADDING="5" CELLSPACING="0" WIDTH="100%" HEIGHT="100%">
	<TR><TD class="bg_lightgray" colspan="2"><br>
		<p class="red">&nbsp;&nbsp; <i>Note: Required fields are indicated with an Asterisk (*).</i></p>
	</TD></TR>
    <TR>
      <TD ALIGN="left" VALIGN="top" WIDTH="30%" class="bg_lightgray">
      <DIV><B>User Group Name</B></DIV>
      </TD>
      <TD ALIGN="left" VALIGN="top" WIDTH="70%" class="bg_lightgray">
      <DIV><INPUT TYPE="text" SIZE="64" NAME="GROUP_NAME" MAXLENGTH="64" VALUE="test"></DIV>
      </TD>
    </TR>
    <TR>
      <TD ALIGN="left" VALIGN="top" class="bg_lightgray">
      <DIV><B>Description</B></DIV>
      </TD>
      <TD ALIGN="left" VALIGN="top" class="bg_lightgray">
      <DIV><INPUT TYPE="text" SIZE="64" NAME="DESC" MAXLENGTH="128" VALUE="my test"></DIV>
      </TD>
    </TR>
    <TR>
      <TD ALIGN="left" VALIGN="top" class="bg_lightgray">
      <DIV><B>Group members</B></DIV>
      </TD>
      <TD ALIGN="left" VALIGN="top" class="bg_lightgray">
      <DIV><B>Not group members</B></DIV>
      </TD>
    </TR>
    <TR>
      <TD ALIGN="left" VALIGN="top" class="bg_lightgray">
      <DIV>
        <INPUT TYPE="checkbox" NAME="member" VALUE="1"> user 1<BR>
        <INPUT TYPE="checkbox" NAME="member" VALUE="2"> user 2<BR>
        <INPUT TYPE="checkbox" NAME="member" VALUE="3"> user 3<BR>
      <TD ALIGN="left" VALIGN="top" class="bg_lightgray">
      <DIV>
        <INPUT TYPE="checkbox" NAME="no_member" VALUE="4"> user 4<BR>
        <INPUT TYPE="checkbox" NAME="no_member" VALUE="5"> user 5<BR>
        <INPUT TYPE="checkbox" NAME="no_member" VALUE="6"> user 6<BR>
      </DIV>
      </TD>
    </TR>
    <TR><TD class="bg_lightgray" colspan="2">
        <SELECT NAME="CAT_ID" oncontrolselect="onChangeCategory()">
          <option value="1">jack wang</option>
          <option value="2">kevin zhang</option>
          <option value="3">sam xia</option>
        </select>
     </TD></TR>

    <TR><TD class="bg_lightgray" colspan="2">
		<HR NOSHADE size="1">
		 <DIV>
		  <A HREF="javascript: saveChanges()"><IMG src="<%=imageDir%>/hbeam_btn_save.gif" width="110" height="20" border="0" alt="Save Changes"></A><!--
		  --><A HREF="<%=jspDir%>/admin/UserGrpAdmin.jsp"><IMG SRC="<%=imageDir%>/hbeam_btn_cancel.gif" width="110" height="20" border="0" alt="Cancel"></A><BR>
		 </DIV>
     </TD></TR>
  </TABLE>
</TD></TR>
</TABLE>
</DIV>
</FORM>
</body>
</html>